<template>
	<view class="template-wave">

		<tn-nav-bar fixed alpha :isBack="true">
			所有学校
		</tn-nav-bar>


		<view class="tn-search-fixed tn-padding-sm" style="  	 	  
    position: fixed;z-index: 333;width: 100%;" :style="{top: vuex_custom_bar_height + 'px'}">
			<view class="tn-flex tn-flex-row-between ">
				<view class=" tn-flex-2 justify-content-item align-content-item">
					<view class="tn-bg-gray--light tn-flex tn-flex-col-center"
						style="border-radius: 100rpx;padding: 10rpx 20rpx 10rpx 20rpx;width: 100%;">
						<text
							class="tn-icon-search justify-content-item tn-padding-right-xs tn-color-gray tn-text-lg"></text>
						<input class="justify-content-item" placeholder="关键词搜索" v-model="searchKey"
							placeholder-style="color:#AAAAAA"></input>
					</view>
				</view>

				<view class="tn-flex-1 align-content-item">
					<view class="justify-content-item tn-text-center" @click="sousuo()">
						<tn-button  :shadow="true" :backgroundColor="configInfo.button" shape="round"
							padding="20rpx 20rpx" width="150rpx" shadow fontBold>
							<text>搜索</text>
						</tn-button>

					</view>
				</view>
			</view>
		</view>
		<view class="tn-padding-top-xs" :style="{paddingTop: vuex_custom_bar_height+50 + 'px'}">

   <view v-if="myschool.length>0">

			<view class="" style="margin-top: -20rpx;">
				<view class="tn-flex tn-flex-row-between">
					<view class="justify-content-item tn-margin tn-text-bold tn-text-xl">
						已绑定学校
					</view>		
				</view>
			</view>

			
			
			
		
		<view class="tn-margin-sm" v-for="(sub_item,sub_index) in myschool" v-if="myschool.length>0"
			:key="sub_index" style="">
		
			<view class="tn-flex">
				<view class="image-pic " style="margin: 15px 2px;" @click="xuan(sub_item.id)">
					<view>
						<image :src="sub_item.image" mode="aspectFill"
							style="width:100rpx;height: 100rpx;border-radius:15rpx;"></image>
					</view>
				</view>
				<view class=" tn-padding-top-xs " style="width: 100%;margin: 8px 8px;"
					@click="xuan(sub_item.id)">
					<view class=" tn-text-bold clamp-text-1 tn-text-justify ">
						{{ sub_item.title }}
					</view>
		
					<view class="tn-flex tn-flex-row-between tn-flex-col-between" style="margin-top:10px;">
		
						<view class="justify-content-item tn-color-gray tn-text-center"
							style="padding-top: 5rpx;">
							<text class="tn-padding-right">{{sub_item.follow_num}}人已加入</text>
						</view>
		
					</view>
				</view>
				<block >
					<view class="image-pic " style="margin: 15px 2px;width: 170px;" @click="xuanze(sub_item)">
						<tn-button shape="round" :backgroundColor="configInfo.button">
							<text class="tn-text-bold">选择</text>
						</tn-button>
					</view>
				</block>		
		
			</view>
		
		</view>	
			
			
			
			
			
			

</view>





			<mescroll-body ref="mescrollRef" @down="downCallback" @up="upCallback">
<view class="" style="margin-top: -20rpx;">
				<view class="tn-flex tn-flex-row-between">
					<view class="justify-content-item tn-margin tn-text-bold tn-text-xl">
						已开通学校
					</view>		
				</view>
			</view>



				<view class=" tn-bg-white" v-if="content.length==0&&searchKey">
					<view class="tn-margin  tn-padding tn-flex  tn-flex-row-center tn-margin-top-sm"
						style="border-radius: 10rpx;">
						<view @click="voctap" style="font-size: 20px;padding: 80rpx;">
							<view class="tn-icon-help-fill " style="font-size: 100px;color: #A4E82F;"></view>
							<view style="font-size: 14px;" class="tn-text-center">暂时没有收入该学校，你可以向管理员申请开通哦！</view>
							<view class="tn-color-black tn-text-df tn-text-center tn-padding-top"
								@click="navigateToFn({ url: '/homeMixinPages/about?id=26', checkLogin: false })">
								<tn-tag :plain="true" shape="radius" margin="10rpx" width="150rpx">
									<text>联系我们</text>
								</tn-tag>

							</view>

						</view>
					</view>

				</view>



				<view class="tn-margin-sm" v-for="(sub_item,sub_index) in content" v-if="content.length>0"
					:key="sub_index" style="">

					<view class="tn-flex">
						<view class="image-pic " style="margin: 15px 2px;" @click="xuanze(sub_item.id)">
							<view>
								<image :src="sub_item.image" mode="aspectFill"
									style="width:100rpx;height: 100rpx;border-radius:15rpx;"></image>
							</view>
						</view>
						<view class=" tn-padding-top-xs " style="width: 100%;margin: 8px 8px;"
							@click="xuan(sub_item.id)">
							<view class=" tn-text-bold clamp-text-1 tn-text-justify ">
								{{ sub_item.title }}
							</view>

							<view class="tn-flex tn-flex-row-between tn-flex-col-between" style="margin-top:10px;">

								<view class="justify-content-item tn-color-gray tn-text-center"
									style="padding-top: 5rpx;">
									<text class="tn-padding-right">{{sub_item.follow_num}}人已加入</text>
								</view>

							</view>
						</view>
						
						<block >

							<view class="image-pic "  style="margin: 15px 2px;width: 170px;"
								@click="xuanze(sub_item)">
								<tn-button shape="round" :backgroundColor="configInfo.button"
									>
									<text class="tn-text-bold">选择</text>
								</tn-button>
							</view>
							

						</block>




					</view>

				</view>

			</mescroll-body>










		</view>
		<login-fn :is-show-login="loginBoxFlag" @loginSuccessCallback="refreshFn" @close="closeGlobalLoginFn">
		</login-fn>


	</view>
</template>

<script>
	import template_page_mixin from '@/libs/mixin/template_page_mixin.js'
	import NavIndexButton from '@/libs/components/nav-index-button.vue'

	import MescrollBody from '@/components/mescroll-uni/mescroll-body.vue';
	import MescrollUni from '@/components/mescroll-uni/mescroll-uni.vue';
	import MescrollMixin from '@/components/mescroll-uni/mescroll-mixins.js';
	export default {
		name: 'TemplateGroup',
		mixins: [template_page_mixin, MescrollMixin],
		components: {
			MescrollBody,
			NavIndexButton
		},

		data() {
			return {
				myschool:[],
				zhubo: false,
				num: '',
				wen_da: '',
				itemwen: [],
				searchKey: '',
				loginBoxFlag: false,
				content: [],
				type: '',
				wentishow: false
			}
		},
		onLoad(option) {
			let that = this
			uni.$off('setLoginBoxFlag');
			uni.$on('setLoginBoxFlag', loginBoxFlag => {
				that.loginBoxFlag = loginBoxFlag;
			});
			

			if (option.type) {
				this.type = option.type
				this.myschoolinfo()
			}
		//	this.myinfo()
		
		},
		methods: {
			
			xuanze(item) {	
				if (this.type){
					uni.$emit('love_index_school', item)
				}else{
					uni.$emit('love_shool', item)
				}
				
				uni.navigateBack()
			},

	async myschoolinfo() {
				let that = this;
				let result = await that.$request({
					loading: 1,
					method: 'post',
					url: '/chat/school/myschool',
					data: {					
					}
				});
				if (result.data.code == 200) {
				   this.myschool=result.data.data				
				}
			},
			sousuo() {

				this.mescroll.resetUpScroll();
			},

			xuan_wen(itemwen) {
				this.wentishow = true
				this.itemwen = itemwen
			},


			jubaopass() {
				if (this.itemwen.wen_da !== this.wen_da) {
					this.msg('答案不正确')
					return
				}
				this.xuan(this.itemwen)
			},

			async flow(id) {
				let that = this;
				let result = await that.$request({
					loading: 1,
					method: 'post',
					url: '/chat/user/followgroup',
					data: {
						id: id
					}
				});			
			},
			async xuan(item) {
				let that = this;
				let result = await that.$request({
					loading: 0,
					method: 'post',
					url: '/chat/school/bang_school',
					data: {
						id: item.id,
						title: item.title
					}
				});

				if (result.statusCode == 200) {
					if (result.data.code == 200) {

						this.jinru(item)
						this.flow(item.id)
						this.msg(result.data.msg)
						uni.$emit('loginok', true)
						uni.navigateBack()
					} else {
						this.msg(result.data.msg)
					}

				}

			},


			refreshFn() {

			},
			closeGlobalLoginFn() {
				this.loginBoxFlag = false;
			},
			/// 列表调用
			downCallback(mescroll) {

				mescroll.endSuccess();
				mescroll.resetUpScroll();
			},

			async upCallback(mescroll) {
				let that = this;
				let result = await that.$request({
					loading: 1,
					method: 'post',
					url: '/chat/school/Schoollist',
					data: {
						keys: this.searchKey,
						page: mescroll.num,
						latitude: uni.getStorageSync('latlng').latitude,
						longitude: uni.getStorageSync('latlng').longitude
					}
				});
				if (result.statusCode == 200) {
					if (result.data.code == 200) {

						if (mescroll.num == 1) {
							that.content = result.data.data.data;
						} else {
							that.content = that.content.concat(result.data.data.data);
						}
						mescroll.endSuccess(result.data.data.data.length, result.data.data.data.length >= mescroll
							.size);

					} else {
						uni.showToast({
							icon: 'none',
							title: result.data.msg
						});
					}
				} else {
					uni.showToast({
						icon: 'none',
						title: that.$errorMsg
					});
				}
			}

		}
	}
</script>

<style lang="scss" scoped>





</style>